<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>sallerRegistInfo</title>
    <link rel="stylesheet" type="text/css" href="../../css/api.css" />
    <link rel="stylesheet" type="text/css" href="../../css/aui.css" />
	<style>
        #sallerRegistInfo{
          background:url(../../image/main/info@2x.png) no-repeat center;
          background-size: 100% 100%;
        }
      .login-input {
          text-indent: 5px;

        }
        .aui-list{
              background-color:rgba(255, 255, 255, 0);
        }
        .aui-list .aui-list-item{
          letter-spacing: 2px;
          margin: 0 0 0px 28px;
          height: 56px;
          line-height: 56px;
          font-size: 17px;
          padding-left: 0;
          border-bottom: 1px solid rgba(204,204,204,.2);
           background-image: -webkit-linear-gradient(90deg,rgba(221, 221, 221, 0),rgba(221, 221, 221, 0) 50%,transparent 50%);
           background-image: linear-gradient(90deg,rgba(221, 221, 221, 0),rgba(221, 221, 221, 0) 50%,transparent 50%);
        }
        .aui-list .aui-list-item{
          height: 74px;
          border-bottom: 1px solid rgba(204,204,204,0);
        }
        @media screen and (-webkit-min-device-pixel-ratio: 1.5){
          .aui-list {
              background-image:linear-gradient(90deg,rgba(221, 221, 221, 0),rgba(221, 221, 221, 0) 50%,transparent 50%);
          }
        }
        .aui-btn-block{
          width: 90%;
          margin:0 auto;
        }
        .getVilidCode{
          float: right;
          text-align: right;
          font-size: 17px;
          color:#969696 !important;
          background-color: rgba(255, 255,255, 0)!important;
          padding-right: 0;
        }
        .login-input{
          font-size: 17px;
        }
        .aui-list.aui-form-list {
          border-top:none!important;
        }
        .rightArrow {
          float: right;
          width: 8px;
          height: 15px;
          margin: 6px 0 0 5px;
        }
        .rightPic{
          width: 55px;
          height: 55px;
          float: right;
          margin-top: -15px;
        }
        .rightPic img{
          width: 55px;
          height: 55px;
          border-radius: 50%;
        }
        .rightCheck{
          width: 55px;
          height: 55px;
          font-size: 15px;
          padding-left: 5px;
          text-align: center;
          line-height: 55px;
          margin-top: -15px;
          float: right;
          position: relative;
          z-index: 1;
          text-indent: 0;
          margin-right: 0;
         }
         .registFav{
           margin-left: 28px;
         }
         .registFav h2{
           font-size: 16px;
           letter-spacing: 2px;
         }
         .registFav ul{
           height: auto;
           display: flex;
           flex-wrap: wrap;
           margin-top: 10px;
         }
         .registFav li{
           float: left;
           padding-right: 30px;
           font-size: 16px;
           color: #969696;
           letter-spacing: 2px;
           line-height: 28px;
         }
         .rightCheck input{
           width: 55px;
           height: 55px;
           position: absolute;
           left: 0;
           top: 0;
           z-index: 5;
           background-color: rgba(255, 255, 255, 0);
           border: none;
         }
         .sexCheck:checked{
           background: url(../../image/sexCheck@2x.png) no-repeat -5px center;
           background-size: 115%;
           background-color:rgba(255, 255, 255, 0);
           border: none;
         }
         .sexCheck:before,
         .sexCheck:after {
           border: none!important;
         }
         .aui-margin-r-15{
           margin-right: 23px !important;
         }
         .niColor{
           color: #000!important;
         }
         /*适配屏幕320px*/
         @media (max-width: 320px){
           .aui-list .aui-list-item{
             height: 64px;
             line-height: 64px;
           }
           .aui-list .aui-list-item,
           .login-input,
           .getVilidCode,
           {
             font-size: 12px!important;
           }
       	}
         /*适配屏幕320px*/
	</style>
</head>
<body>
  <div id="sallerRegistInfo"  v-bind:style="{height:wHeight}">
    <section class="aui-content aui-margin-t-15">
        <ul class="aui-list aui-form-list ">
            <li class="aui-list-item" @click="selectUserPic(0)">
              <div class="aui-list-item-label color-orange">
                  公司LOGO
              </div>
                <div class="aui-list-item-label aui-margin-r-15" style="width: 8rem;padding-right: 0;">
                    <div class="aui-btn  getVilidCode" style="width: 8rem;">
                      <img src="../../image/getin@2x.png" class="rightArrow"/>
                      <div  class="rightPic"><img :src="upLoadPic1"/></div>

                    </div>
                </div>
            </li>
            <li class="aui-list-item" v-on:click="editCompanyName()">
              <div class="aui-list-item-label  color-orange">
                  企业名称
              </div>
                    <div class="aui-list-item-label aui-margin-r-15" style="width: 10rem;padding-right: 0;">
                        <div class="aui-btn  getVilidCode" style="width: 10rem;" v-bind:class="{niColor:black1}">
                          {{palcehoderNameValue1}}
                           <img src="../../image/getin@2x.png" class="rightArrow"/>
                        </div>
                    </div>
            </li>
            <li class="aui-list-item" v-on:click="editCompanyConect()">
              <div class="aui-list-item-label  color-orange">
                  联系人姓名
              </div>
                    <div class="aui-list-item-label aui-margin-r-15" style="width: 10rem;padding-right: 0;">
                        <div class="aui-btn  getVilidCode" style="width: 10rem;" v-bind:class="{niColor:black2}">
                          {{palcehoderNameValue2}}
                           <img src="../../image/getin@2x.png" class="rightArrow"/>
                        </div>
                    </div>
            </li>
            <li class="aui-list-item" v-on:click="editCompanyCode()">
              <div class="aui-list-item-label  color-orange">
                  手机号
              </div>
                    <div class="aui-list-item-label aui-margin-r-15" style="width: 10rem;padding-right: 0;">
                        <div class="aui-btn  getVilidCode" style="width: 10rem;" v-bind:class="{niColor:black3}">
                          {{palcehoderNameValue3}}
                           <img src="../../image/getin@2x.png" class="rightArrow"/>
                        </div>
                    </div>
            </li>
        </ul>
    </section>
  </div>
</body>
<script type="text/javascript" src="../../script/api.js"></script>
<script type="text/javascript" src="../../script/vue.min.js"></script>
<script type="text/javascript" src="../../script/common.js"></script>
<script type="text/javascript" src="../../script/fastclick.js"></script>
<script type="text/javascript">
    apiready = function(){
        api.parseTapmode();
        api.addEventListener({
            name: 'resetName'
        }, function(ret, err) {
            app.palcehoderNameValue1 = ret.value.NameValue;////编辑昵称页面传来昵称
            app.black1 = ret.value.staut;/////编辑昵称页面传来状态
          //alert(JSON.stringify(ret.value));
        });
        api.addEventListener({
            name: 'resetSallerName'
        }, function(ret, err) {
            app.palcehoderNameValue2 = ret.value.sallerName;////编辑昵称页面传来昵称
            app.black2 = ret.value.staut;/////编辑昵称页面传来状态
        });
        api.addEventListener({
            name: 'resetSallerCode'
        }, function(ret, err) {
            app.palcehoderNameValue3 = ret.value.sallerCodeValue;////编辑昵称页面传来昵称
            app.black3 = ret.value.staut;/////编辑昵称页面传来状态
        });
    };
    ////初始化页面
    var app = new Vue({
        el: '#sallerRegistInfo',
        data: {
            wHeight: '',
            palcehoderNameValue1 : '请输入企业名称',
            palcehoderNameValue2 : '请输入联系人姓名',
            palcehoderNameValue3 : '请输入手机号码',
            black1 : false,
            black2 : false,
            black3 : false,
            upLoadPic1 : "../../image/uplaodPic@2x.png",////头像选取路径
        },
        methods: {
            init: function() {
              /////初始化页面高度
                var wh = document.documentElement.clientHeight || document.body.clientHeight;
                this.wHeight = (wh-20) + 'px';
            },
            agreement : function(){
              this.isAgreement = this.$refs.isChecked.value;////同意值为on
            },
            //////点击修改头像弹出底部菜单
            selectUserPic : function(){
              api.actionSheet({
                title: '',
                cancelTitle: '取消',
                destructiveTitle: '',
                buttons: ['从相册中选取', '拍照']
              }, function(ret, err) {
                var index = ret.buttonIndex;
                if(index == 1){
                   infoMethod.gotoLogin_checkPic();
                }else if(index == 2){
                   infoMethod.gotoLogin_takePhoto();
                }
              });
            },
            //////点击修改昵称
            editCompanyName : function(){
                   bf_common_view.bf_win.openWin('saller_resetName', '../sallerRegist/');/////点击到编辑联系人页面
            },
            editCompanyConect : function(){
                   bf_common_view.bf_win.openWin('saller_resetSallerName', '../sallerRegist/');/////点击到编辑企业名称页面
            },
            editCompanyCode : function(){
                   bf_common_view.bf_win.openWin('saller_resetSallerCode', '../sallerRegist/');/////点击到编辑组织机构代码页面
            }
        },
        mounted:function(){
            this.init();
        }
    });
    var infoMethod = {
        gotoLogin_checkPic : function(){
          // bf_common_view.bf_win.openWin('login_checkPic', '../login/');
           api.getPicture({
               sourceType: 'library',
               mediaValue: 'pic',
               destinationType: 'url',
               allowEdit: true,
               quality: 50,
               targetWidth: 200,
               targetHeight: 300,
               saveToPhotoAlbum: false
           }, function(ret, err) {
                 if (ret) {
                          app.upLoadPic1 = ret.data;
                 }
           });
        },
        gotoLogin_takePhoto : function(n){
          api.getPicture({
              sourceType: 'camera',
              mediaValue: 'pic',
              destinationType: 'url',
              allowEdit: true,
              quality: 50,
              targetWidth: 100,
              targetHeight: 100,
              saveToPhotoAlbum: false
          }, function(ret, err) {
              if (ret) {
                       app.upLoadPic1 = ret.data;
              }
          });
        }
    }
</script>
</html>
